.container{
  height: 100%;
  background-color: #F0F2F5;
  padding-bottom: 56px;
  
  .box{
    position: relative;
    top: 56px;
    margin: 20px auto;
    width: 78%;

    &-main{
      padding: 20px;
      border-radius: 20px;
      background-color: #fff;

      &-top{
        margin-bottom: 20px;
        
        &-category{
          margin-right: 8px;
          font-weight: 600;
        }

        &-categoryItem{
          font-size: 14px;
          margin: 0 8px;
        }
      }

      &-content{
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;

        &-item{
          cursor: pointer;
          
          &-bg{
            width: 100%;
            height: 128px;
          }

          &-user{
            display: flex;

            &-avatar{
              border-radius: 50%;
              width: 32px;
              height: 32px;
            }

            &-right{
              margin-left: 8px;

              &-name{
                font-size: 14px;
              }

              &-time{
                font-size: 12px;
                color: #888;
              }
            }
          }
        }
      }
    }

    
  }
}